<#assign contextPath=springMacroRequestContext.getContextPath() />
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>${title}</title>
		<style type="text/css">
			div,p,label,input,h1,h2,h3,h4,h5,h6{font-size: 14px;margin: 0px;padding: 0px;}
			body{background: url(${contextPath}/resources/images/473.jpg);}
			#login{display: none;}
			.login{position: relative;z-index: 999;top: 160px;width: 310px;margin: auto;border: auto;}
			.login .l-bg{position: absolute;z-index: -1;height: 100%;width: 100%;background: #000;color: #fff;opacity: 0.5;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;}
			.login .l-top{height:20px;background-color: lightseagreen;padding: 10px;}
			.login .l-top .l-title{float:left;font-size: 16px;color: #fff;}
			.login .l-top .win-btn{float: right;}
			.login .l-top .win-btn a{color: #fff;text-decoration:none;}
			.login .l-form{padding:10px 20px;}
			.login .l-form p{line-height: 30px;padding: 10px 0px;text-align: center;color: #fff;}
			.login .l-form p input{height: 30px;width: 200px;border-radius: 5px;border: 1px solid #aaa;padding-left: 10px;}
			.login .l-form p a{color: #2aA}
			.login .l-form .l-btn{padding: 0px;}
			.login .l-form .l-btn input{background:#fff;border: none;color: #000;font-weight: 600;width: 110px;}
			.login .l-third{margin:0px 20px;border-top: 1px solid #AAA;padding: 10px;text-align: center;}
			.l-third *{width: 30px;height: 30px;display: inline-block;}
			.qq-icon{background: url(${contextPath}/resources/images/icon.png) -50px -138px no-repeat;}
			.wx-icon{background: url(${contextPath}/resources/images/icon.png) 0px -138px no-repeat;}
			.xl-icon{background: url(${contextPath}/resources/images/icon.png) -150px -138px no-repeat;}
			.ali-icon{background: url(${contextPath}/resources/images/icon.png) -100px -138px no-repeat;}
			.model-bg{position: absolute; width: 100%;height: 100%;left: 0px;top: 0px;background: #000;opacity: 0.5;z-index: 99;}
		</style>
	</head>

	<body>
		<a id="to-login" href="javascript:void();">登陆</a>
		<form action="${contextPath}login" id="login" method="post">
			<input type="hidden" name="redirectUrl" value="${redirectUrl}">
			<input type="hidden" name="loginToken" value="${token}">
			<div class="model-bg"></div>
			<div class="login">
				<div class="l-bg"></div>
				<div class="l-top">
					<h1 class="l-title">用户登录</h1>
					<div class="win-btn">
						<a href="javascript:loginClose()" class="close">X</a>
					</div>
				</div>
				<div class="l-form">
					<p>
						<label for="loginName">登录名</label>
						<input name="loginName" placeholder="邮箱/手机" />
					</p>
					<p>
						<label for="password">密&nbsp;码</label>
						<input name="password" type="password" placeholder="登录密码" />
						<a href="index.html">忘记密码</a>&nbsp;<a href="index.html">快速注册</a>
					</p>
					<p class="l-btn">
						<input type="submit" value="登陆" />
					</p>
				</div>
				<div class="l-third">
					<span class="qq-icon" title="QQ登录"></span>
					<span class="wx-icon" title="微信登录"></span>
					<span class="xl-icon" title="新浪微博登录"></span>
					<span class="ali-icon" title="支付宝登录"></span>
				</div>
			</div>
		</form>
	</body>
	<script type="text/javascript">
		document.getElementById('to-login').addEventListener('click',function(e){
				document.getElementById('login').style.display = 'block';
			});
	</script>
	<script type="text/javascript">
		function loginClose(){
			document.getElementById('login').style.display = 'none';
		}
	</script>
</html>